<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1.0, user-scalable=no"/>
	<title>“组团啦”杯冠军竞猜</title>
	<link rel="stylesheet" href="__PUBLIC__/Guess/css/public.css" />
</head>
<body>
<div id="top-height"></div>
<div id="wrapper" class="center-block">
	<form action="" id="login-form">
		<ul id="radio-btn" class="center-block">
			<div id="radios">
				<div>
					<input type="radio" name="guess_name" value="ZTR" id="radio-1"/>
				</div>
				<div>
					<input type="radio" name="guess_name" value="不与" id="radio-2"/>
				</div>
			</div>
			<li id="team-1"><img src="__PUBLIC__/Guess/img/team1-c.png" alt="" width="65%"/><p>ZTR</p></li>
			<li id="team-2"><img src="__PUBLIC__/Guess/img/team2-c.png" alt="" width="65%"/><p>不与</p></li>
		</ul>
		<ul id="percent-bar" class="center-block">
			<li id="percent-l" style="width: {$ztr}">{$ztr}</li>
			<li id="percent-r" style="width: {$by}">{$by}</li>
		</ul>
		<!--<div class="input-wrapper center-block">
            <input type="text" placeholder="姓名"/>
            <span class="icon-username"><img src="img/user.png" width="100%"/></span>
        </div>-->
		<if condition="$is_guess==1">
			<div class="input-wrapper center-block">
				<input type="text" placeholder="手机号" name="phone" id="phone"/>
				<span class="icon-password"><img src="__PUBLIC__/Guess/img/phone.png" width="100%"/></span>
			</div>
			<p>请先输入手机号再进行投票</p>
			<button class="btn-normal" type="submit">就选你了!</button>
			<else/>
			<div class="code-wrapper">
				<img src="__PUBLIC__/Guess/img/erweima.png" alt="" width='50%' class="text-center"/>
				<p>(长按二维码进行关注)</p>
			</div>
		</if>
	</form>
	<article>
		<h1 class="text-center">活动规则</h1>
		<ul id="text-part">
			<li><span>1.活动时间：4月12日0:00-4月16日12：00</span></li>
			<li><span>2.竞猜规则：</span>可根据自己对战队的了解，通过官方竞猜页面选择一支你认为最终获得2016年组团啦杯英雄联盟比赛冠军的战队（每个微信号和手机号限投一票）。投票结束后将在4月16日组团啦杯英雄联盟冠军争夺赛中直播抽取10名幸运竞猜者（需关注组团啦微信号：zutuanla）
			</li>
			<li><span>3.</span>组团啦官方工作人员</li>
			<li><span>4.奖品：</span>50QB每人</li>
			<li><span>5.抽奖代表：</span>组团啦官方工作人员</li>
			<li><span>6.抽奖地点：</span>上海市大悦城炫控电竞吧</li>
			<li><span>本次活动解释权归组团啦平台所有。</span></li>
		</ul>
	</article>
</div>

<script src="__PUBLIC__/Guess/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript">
	var top_height=window.innerWidth*0.78;
	document.getElementById("top-height").style.height=top_height+'px';
	function share () {
		var option = {
			title: '组团啦杯冠军竞猜', // 分享标题
			desc: '组团啦杯冠军竞猜 we need you', // 分享描述
			link: "http://lol.xuanzhen-tech.com/index.php/Home/Guess/index", // 分享链接
			imgUrl: 'http://lol.xuanzhen-tech.com/Public/match/img/logo.png', // 分享图标
		};
		wx.onMenuShareTimeline(option);
		wx.onMenuShareAppMessage(option);
		wx.onMenuShareWeibo(option);
		wx.onMenuShareQQ(option);
		wx.onMenuShareQZone(option);
	}
	(function(){
		var $team1=$('#team-1'),$team2=$('#team-2'),$radio1=$('#radio-1'),$radio2=$('#radio-2');
		$team1.on('touchstart',function(){
			$team1.children('img').attr('src','__PUBLIC__/Guess/img/team1.png');
			$team2.children('img').attr('src','__PUBLIC__/Guess/img/team2-c.png');
			$radio1.click();
		})
		$team2.on('touchstart',function(){
			$team2.prop('checked','true').children('img').attr('src','__PUBLIC__/Guess/img/team2.png');
			$team1.prop('checked','false').children('img').attr('src','__PUBLIC__/Guess/img/team1-c.png');
			$radio2.click();
		})
		var form = $("#login-form");
		form.on('submit',function(e){
			e.preventDefault();
			var is_radio=$('input:radio[name="guess_name"]:checked').val();
			if(is_radio==null){
				alert('请选择战队');
				return;
			}
			var phone_reg = /(^1[3|4|5|7|8][0-9]{9}$)/;
			var phone = $("#phone").val();
			if(!phone_reg.test(phone)){
				alert("请输入正确的手机号");
				return;
			}
			$.post('',form.serialize(),function(data){
				if(data.status==0){
					alert(data.info);
				}
				else{
					alert(data.info);
					location.reload();
				}
			})
		})
		wx.ready(share);
		var wxData = {$js};
		wx.config(wxData);
	})();


</script>
</body>
</html>
